<template>

  <div class="content">
    <nav-title title="欢迎您加入奥克斯" :notback="false"/>
    <div class="login-box">
      <div class="welcome-img" />
      <div class="line" v-if="!entered">
          <router-link to="/informationCollection/userInfo" tag="div">
            <div class="line-icon base_info"></div>
            基本信息采集
          </router-link>
      </div>
      <div class="line" v-if="!entered">
          <router-link to="/infoupload" tag="div">
            <div class="line-icon entry_info"></div>
            入职材料补充
          </router-link>
      </div>
      <div class="enterInfo" v-if="entered">
        您已完成入职办理流程，<br/>
        无需重复提交数据！
      </div>
    </div>
   
  </div>
</template>

<script>
  import axios from 'axios'
  import Exif from './exif.js'
  import {newEntry, getQrmsg} from '../../api/api'
  import { json2Form } from '../../util/http'
  export default {
    name: "information-collection",
    data() {
      return {
        empid: 0,
        entered: false,
        headfimg:'',
        picValue: '',

        nationalId:'',
        name:''
      }
    },
    created(){
      if(this.$store.state.hid){
        this.empid = this.$store.state.hid
        this.getBsInfo()
      } else {
        this.$router.push("/hireLogin")
      }
    },
    methods: {
      getBsInfo() {
        let params = {rsHireId: this.empid}
        getQrmsg(params).then(res => {
          this.entered = (res && res.retCode === '000000' && res.retData != '' && res.retData.rsHirStatus == 'C')
        })
      },
    }
  }
</script>

<style type="text/scss" lang="scss" scoped>
  .content {
    .login-box{
      .welcome-img{
        width: 100%;
        padding-bottom: 70%;
        background: url(./image/u36.png) no-repeat center;
        background-size: 100% 100%;
        border-bottom: 1px solid #ddd;
      }
      .infor-region{
        >div{
          line-height: 80px;
          width: 100%;
          box-sizing: border-box;
          text-align: left;
          color: #000000;
          border-bottom: 1px solid #aaaaaa;
          &::before{
            content: " ";
            float: left;
            width: 80px;
            padding-bottom: 80px;
            background: url(./image/u29.png) no-repeat center;
            background-size: 50px 50px;
            background-color: #1c92f5;
            border-radius: 50px;
          }
          &::after{
            content: " ";
            float: right;
            width: 40px;
            padding-bottom: 80px;
            background: url(./image/u252.png) no-repeat center;
            background-size: 20px 20px;
          }
        }
      }
      .enterInfo{
        font-size:1.5em;
        margin-top:100px;
      }
      .line {
        padding: 10px;
        align-items: center;
        box-sizing: border-box;
        border-bottom: 1px solid #e5e5e5;
        >div{
          line-height: 60px;
          width: 100%;
          box-sizing: border-box;
          text-align: left;
          font-size: 18px;
          .line-icon{
            width: 60px;
            height: 60px;
            border-radius: 50%;
            margin-right: 20px;
            background-color: #1c92f5;
            background-repeat: no-repeat;
            background-position: center center;
            background-size: 64%;

            float: left;
            &.base_info {
              background-image:url(./image/u29.png)
            }
            &.entry_info {
              background-image:url(./image/u34.png)
            }
          }
          &::after {
            content: " ";
            float: right;
            width: 20px;
            height: 20px;
            margin-top: 16px;
            background-image: url(./image/arrow-right.png)
          }
        }
      }
    }
    
  }
</style>
